<template>
  <div class="bar">
    <el-tree
      :data="formData"
      :props="defaultProps"
      @node-click="handleNodeClick"
    />
  </div>
</template>
<script>
export default {
  props: {
    formData: {
      type: Array,
      default: () => []
    },
    handleTree: {
      type: Function,
      default: () => {}
    }
  },
  data() {
    return {
      data: [
        {
          label: '物业总公司(1298)',
          children: [
            {
              label: '财务管理中心(12)',
              children: [
                {
                  label: '三级 1-1-1'
                }
              ]
            },
            {
              label: '投资拓展中心(20)',
              children: [
                {
                  label: '三级 1-1-1'
                }
              ]
            },
            {
              label: '品质管理中心(19)',
              children: [
                {
                  label: '三级 1-1-1'
                }
              ]
            },
            {
              label: '战略管理中心(12)',
              children: [
                {
                  label: '流花11-1(4)'
                },
                {
                  label: '陆丰13-1(2)'
                },
                {
                  label: '陆丰22-1(2)'
                }
              ]
            },
            {
              label: '拓后事业部(55)',
              children: [
                {
                  label: '流花11-1(4)'
                }
              ]
            },
            {
              label: '行政与风控审计中心(8)',
              children: [
                {
                  label: '流花11-1(4)'
                }
              ]
            },
            {
              label: '行政与风控审计中心(8)',
              children: [
                {
                  label: '流花11-1(4)'
                }
              ]
            },
            {
              label: '行政与风控审计中心(8)',
              children: [
                {
                  label: '流花11-1(4)'
                }
              ]
            }
          ]
        },
        {
          label: 'A区域(456)',
          children: [
            {
              label: '二级 2-1',
              children: [
                {
                  label: '三级 2-1-1'
                }
              ]
            },
            {
              label: '二级 2-2',
              children: [
                {
                  label: '三级 2-2-1'
                }
              ]
            }
          ]
        },
        {
          label: 'B区域(456)',
          children: [
            {
              label: '二级 3-1',
              children: [
                {
                  label: '三级 3-1-1'
                }
              ]
            },
            {
              label: '二级 3-2',
              children: [
                {
                  label: '三级 3-2-1'
                }
              ]
            }
          ]
        },
        {
          label: 'C区域(456)',
          children: [
            {
              label: '项目A',
              children: [
                {
                  label: '三级 3-1-1'
                }
              ]
            },
            {
              label: '项目B',
              children: [
                {
                  label: '三级 3-2-1'
                }
              ]
            }
          ]
        }
      ],
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    }
  },
  methods: {
    handleNodeClick(data) {
      this.handleTree(data.id)
    }
  }
}
</script>
<style lang="scss" scoped>
@import './index';
</style>
